import { useEffect, useRef } from "react";
import img404 from '@/assets/error.png';

const ErrorResolveImage = (props: { src: string, width: number, height: number }) => {
    const { src = img404, width, height } = props;
    // 图片元素
    const imgRef = useRef<HTMLImageElement>(null);

    useEffect(() => {
        imgRef.current!.addEventListener('error', e => {
            (e.target! as HTMLImageElement).src = img404;
        });
    }, []);

    return (
        <img {...{ src, width, height }} ref={imgRef} />
    );
};

export default ErrorResolveImage;